<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">
<h:head>
<title>BeerAir</title>
<link href="./css/bootstrap.css" 
      rel="stylesheet" type="text/css"/> 
    <link href="./css/styles.css" 
      rel="stylesheet" type="text/css"/> 
      <script type="text/javascript" src="./resources/myjs.js"/>
   	<h:outputScript library="js" name="myjs.js"/>
</h:head>
<h:body onload="showMessage('#{offersView.error}')">
<h:graphicImage id="airplane" value="./images/airplane.jpg"/>
<div id="header"></div>
<div id="container" >
	<div id="navbar">
		<h:form>  
				<p:menubar >  
					<p:menuitem value="Flights"/>  
					<p:menuitem value="Offers"/>  
					<p:menuitem value="My Booking"/>  
					<p:menuitem value="About"/>  
     				<p:menuitem value="FAQ"/>  
    				<f:facet name="options">  
    		   		    <p:inputText style="margin-right:10px"/>  
     		    	   <p:commandButton type="button" value="Search"/>  
     		   		</f:facet>  
  				</p:menubar>  
		</h:form>  	
	</div>
	<div id="content">
		<h:form class="mainform">
			<h1>Offers</h1><br/>	
			<h4>Personal Information</h4><br/>
			<table>
				<tr>
					<td>
						<label>First Name</label>
						<h:inputText value="#{offersView.firstName}" />
					</td>
					<td>
						<label>Second Name</label>
						<h:inputText value="#{offersView.secondName}" />
					</td>
					<td>
						<label>BirthDate</label>
						<p:calendar value="#{offersView.birthDate}"/>
					</td>
				</tr>
				<tr>
				<td>
					<label>Document Type</label>
   					 	<h:selectOneMenu value="#{offersView.docType}">
   					 		<f:selectItem itemValue="idcard"/>
 							<f:selectItem itemValue="passport"/>
   						 </h:selectOneMenu>	
   					 </td>
					<td>
						<label>Document ID</label>
						<h:inputText value="#{offersView.docID}" />
					</td>
					<td>
						<label>Expiration Date</label>
						<p:calendar value="#{offersView.expDate}"/>
					</td>
				</tr>
				<tr>
					<td colspan="2">
					<label>Baggage</label>
   					 	<h:selectOneMenu value="#{offersView.baggage}">
   					 		<f:selectItem itemValue="15Kg"/>
 							<f:selectItem itemValue="20Kg"/>
 							<f:selectItem itemValue="30Kg"/>
 							<f:selectItem itemValue="50Kg"/>
   						 </h:selectOneMenu>	
   					 </td>
				</tr>
			</table><br/>
			<h:commandButton class="submit" value="Next" action="#{offersView.showPayment}"/>
			<h:commandButton class="submit" value="Back" action="#{offersView.showTimetable}"/>
		</h:form>
	</div>
	<div id="aside">
		<div id="recap">
			<h3>Summary</h3>
			<p><b>Departure Airport</b>: #{homeView.depAirport}</p>
			<p><b>Arrival Airport</b>: #{homeView.arrAirport}</p>
			<p><b>One-Way</b>: #{homeView.oneWay}</p>
			<p><b>Departure Date</b>: #{homeView.dateToString(homeView.depDate)}</p>
			<p><b>Return Date</b>: #{homeView.dateToString(homeView.retDate)}</p>
			<p><b>Adults</b>: #{homeView.adult}</p>
			<p><b>Children(&#60; 16)</b>: #{homeView.child}</p>
			<p><b>Infants(&#60; 2)</b>: #{homeView.infant}</p>
		</div>
	</div>
</div>
<div id="footer"></div>
</h:body>
</html>